<!DOCTYPE html>
<script src="../../../resources/run-after-layout-and-paint.js"></script>
<script>
onload = function() {
    var host = document.getElementById('host');
    var sr = host.attachShadow({mode: 'open'});
    // To make documentScopeDirty clean, add fake style element to document.
    document.head.appendChild(document.createElement('style'));
    // Should invoke style recalc here.
    document.body.offsetLeft;

    // Need a parent element of a shadow host.
    // Shadow hosts' styles are recalc-ed by updating styles in shadow trees, but
    // Their parents are not recalc-ed.
    var parentOfHostInShadow = document.createElement('div');
    var hostInShadow = document.createElement('div');
    parentOfHostInShadow.appendChild(hostInShadow);

    // Create shadow tree with style which has @import.
    var sr2 = hostInShadow.attachShadow({mode: 'open'});
    sr2.innerHTML = '<style>@import url("../../css/resources/green.css");</style><div>PASS</div></style>';
    sr.appendChild(parentOfHostInShadow);

    // Force style recalc before sheetLoaded here.
    // document.body.offset is slow. It causes style recalc after sheetLoaded.
    // Instead, use internals.updateStyleAndReturnAffectedElementCount
    // (to emulate @import's network delay).
    internals.updateStyleAndReturnAffectedElementCount();

    if (window.testRunner)
        testRunner.waitUntilDone();
    runAfterLayoutAndPaint(function() {
        if (window.testRunner)
            testRunner.notifyDone();
    });
}
</script>
<div id="host"></div>
